package com.piepesken.mediscale.ui.components

import androidx.compose.foundation.background
import androidx.compose.foundation.layout.*
import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.material3.Icon
import androidx.compose.material3.MaterialTheme
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.graphics.vector.ImageVector
import androidx.compose.ui.unit.dp

@Composable
fun DrugIcon(
    icon: ImageVector,
    description: String?,
    backgroundColor: Color
) {
    Box(
        contentAlignment = Alignment.Center,
        modifier = Modifier
            .background(backgroundColor, RoundedCornerShape(15))
            .width(56.dp)
            .height(56.dp)
    ) {
        Icon(
            imageVector = icon,
            contentDescription = description,
            modifier = Modifier
                .width(24.dp)
                .height(24.dp),
            tint = Color.LightGray,
        )
    }
}

@Composable
fun DrugRecordItem(
    icon: ImageVector,
    iconDescription: String?,
    iconBackgroundColor: Color
) {
    Row(
        verticalAlignment = Alignment.CenterVertically,
        modifier = Modifier.padding(16.dp)
    ) {
        DrugIcon(icon = icon, description = iconDescription, backgroundColor = iconBackgroundColor)

        Spacer(modifier = Modifier.width(6.dp))

        Column(
           modifier = Modifier.padding(start = 8.dp)
       ) {
           Text(
               text = "Title of the drug",
               lineHeight = MaterialTheme.typography.titleLarge.lineHeight,
               fontSize = MaterialTheme.typography.titleLarge.fontSize,
               fontWeight = MaterialTheme.typography.titleLarge.fontWeight,
               fontStyle = MaterialTheme.typography.titleLarge.fontStyle,
               modifier = Modifier.padding(bottom = 6.dp)
           )
           Text(
               text = "Description goes brrrrr",
               lineHeight = MaterialTheme.typography.bodyMedium.lineHeight,
               fontSize = MaterialTheme.typography.bodyMedium.fontSize,
               fontStyle = MaterialTheme.typography.bodyMedium.fontStyle,
               fontWeight = MaterialTheme.typography.bodyMedium.fontWeight
           )
       }
    }
}